<template>
  <view class="container">
    <view class="avatar">
      <!-- 上传组件 -->
      <span style="text-align: center;padding-top: 15px;">门店图片:</span>
      <u-upload name="product_img" :maxCount="1" :fileList="filelist" width="100" height="100" @delete="del"
        @afterRead="read" />
    </view>
    <view class="avatar"  v-if="!strplist || JSON.stringify(strplist) != '{}'">
      <!-- 上传组件 -->
      <span>微信头像:</span>
      <u-upload name="product_img" :maxCount="1" :fileList="filelist1" width="100" height="100" />
    </view>

    <view class="content">
      <u-form labelPosition="left" labelWidth="60" :model="store" :rules="rules" ref="product">

        <!-- 名称 -->
        <u-form-item label="真实名字" v-if="!strplist || JSON.stringify(strplist) != '{}'">
          <u-input v-model="strplist.realnickname" placeholder="真实名字" />
        </u-form-item>
        <u-form-item label="加盟手机" v-if="!strplist || JSON.stringify(strplist) != '{}'">
          <u-input v-model="strplist.mobile" placeholder="加盟者手机" />
        </u-form-item>

        <!-- 名称 -->
        <u-form-item label="标题" prop="name">
          <u-input v-model="store.name" ref="title" placeholder="请输入门店名称" />
        </u-form-item>
        <u-form-item label="店铺评分" prop="rate">
          <u-input v-model="store.rate" ref="title" placeholder="请输入门店评分（最高5分）" />
        </u-form-item>
        <u-form-item label="店铺质量" prop="quality">
          <u-input v-model="store.quality" ref="title" placeholder="请输入门店产品质量（最高10）" />
        </u-form-item>
        <u-form-item label="物流速度" prop="speed">
          <u-input v-model="store.speed" ref="title" placeholder="请输入门店平均发货速度（最高10.0）" />
        </u-form-item>
        <u-form-item label="服务保障" prop="guarantee">
          <u-input v-model="store.guarantee" ref="title" placeholder="请输入门店服务保障（最高10）" />
        </u-form-item>
        <u-form-item label="发货时长" prop="dispatch">
          <u-input v-model="store.dispatch" ref="title" placeholder="请输入门店平均发货时间" />
        </u-form-item>
        <u-form-item label="粉丝数量" prop="fensi">
          <u-input v-model="store.fensi" ref="title" placeholder="请输入门店粉丝数量" />
        </u-form-item>
        <u-form-item label="平均好评（%）" prop="pstrv">
          <u-input v-model="store.pstrv" ref="title" placeholder="请输入门店平均好评率(单位%)" />
        </u-form-item>
        <u-form-item label="客服评价（%）" prop="customer">
          <u-input v-model="store.customer" ref="title" placeholder="请输入门店客服满意程度(单位%)" />
        </u-form-item>
        <!-- 门热门状态 -->
        <u-form-item label="热度状态" prop="flag_text" borderBottom @click="showstore = true">
          <u-input v-model="store.flag_text" disabled disabledColor="#ffffff" placeholder="请选择门店热门状态"
            border="none"></u-input>
          <u-icon slot="right" name="arrow-right"></u-icon>
        </u-form-item>
        <u-form-item label="门店电话" prop="mobile">
          <u-input v-model="store.mobile" ref="title" placeholder="请输入门店电话热线" />
        </u-form-item>
        <u-form-item label="门店地址" prop="mobile">
          <u-input v-model="store.address" ref="title" placeholder="请输入门店地址" />
        </u-form-item>

        <u-form-item label="经度" prop="jd">
          <u-input v-model="store.jd" ref="title" placeholder="请输入门店经度" />
        </u-form-item>
        <u-form-item label="纬度" prop="wd">
          <u-input v-model="store.wd" ref="title" placeholder="请输入门店维度" />
        </u-form-item>



        <u-action-sheet :show="showstore" :actions="flaglist" title="请选门店热门状态" @close="showstore = false"
          @select="flagSelect()">
        </u-action-sheet>




        <!-- 提交按钮 -->
        <u-button text="添加门店+" icon="pushpin" size="small" type="success" :customStyle="btnStyle" @click="product" />
      </u-form>
    </view>
    <!-- 消息提醒 -->
    <u-toast ref="notice"></u-toast>
  </view>
</template>

<script>
export default {
  onLoad(option) {

    this.supid = option.supid ? option.supid : ""
    this.auth = this.$u.auth.check();
    this.getflagdata()
    this.getsupplier()
  },

  onReady() {
    this.$refs.product.setRules(this.rules);
  },
  created() {
    setInterval(() => {
      this.$u.count.check();
    }, 15000);
  },
  data() {
    return {
      newthumbArr:[],
      supid: 0,
      strplist: {

      },
      filelist: [],
      filelist1: [],
      flaglist: [],
      auth: {},
      showstore: false,
      stoid: 0,
      flag: "",
      store: {
        name: "",
        thumb: "",
        jd: "",
        wd: "",
        flag_text: "",
        address: "",
        mobile: "",
        customer: "",
        rate: "",
        quality: "",
        speed: "",
        guarantee: "",
        pstrv: "",
        dispatch: "",
        fensi: "",

      },
      piclist: [],
      rules: {
        name: {
          required: true,
          message: "请填写门店名称",
          trigger: ["blur", "change"],
        },
        mobile: {
          required: true,
          message: "门店联系电话不能为空",
          trigger: ["blur", "change"],
        },
        address: {
          required: true,
          message: "门店地址不能为空",
          trigger: ["blur", "change"],
        },
        flag: {
          required: true,
          message: "门店状态不能为空",
          trigger: ["blur", "change"],
        },
        jd: {
          required: true,
          message: "门店经度不能为空",
          trigger: ["blur", "change"],
        },
        wd: {
          required: true,
          message: "门店维度不能为空",
          trigger: ["blur", "change"],
        },

      },
    };
  },

  methods: {

    async getsupplier() {
      let data = {
        adminid: this.auth.id,
        supid: this.supid,
      };

      let result = await this.$u.api.depot.ShenpiInfo(data)
      {
        if (result.code) {
          this.strplist = result.data;
          this.store.name = this.strplist.storename
          if (this.strplist.avatar) {
            this.filelist1 = [
              { url: this.strplist.avatar }

            ]
          }



        }
      }
    },

    // 请求加盟者的数据
    // async getsupplier()
    // {
    //   let result = await this.$u.api.depot.findsupplier({supid:this.supid,adminid:this.auth.id})

    //   if(result.code)
    //   {
    //     this.supplier = result.data

    //   }
    // },
    async getflagdata() {
      let data = {
        adminid: this.auth.id
      }

      let result = await this.$u.api.store.getflaglist(data)

      if (result.code) {
        this.flaglist = result.data
      }
    },
    flagSelect(e) {
      this.store.flag_text = e.name;
      this.flag = e.flag;

    },
    async read(event) {
      //组装上传数据
      var data = {
        filePath: event.file.thumb,
        name: "product_img",
        header: {},
      };

      //调用接口
      var result = await this.$u.api.product.thumbs(data);

      if (result.code) {
        this.store.thumb_text = result.data;
        this.newthumbArr = this.newthumbArr.concat(result.data)

        // 合并对象
        this.filelist = [{ url: result.data }];
        return false;
      } else {
        this.$refs.notice.show({
          type: "error",
          message: result.msg,
        });
        return false;
      }
    },

    product() {
      this.$refs.product
        .validate()
        .then(async () => {
          var data = {
            name: this.store.name,
            adminid: this.auth.id,
            thumb: this.store.thumb_text,
            flag: this.flag,
            jd: this.store.jd,
            wd: this.store.wd,
            newthumbArr:this.newthumbArr,
            supid: this.supid,
            address: this.store.address,
            mobile: this.store.mobile,
            supmobile: this.strplist.mobile,
            realnickname: this.strplist.realnickname,
            customer: this.store.customer,
            rate: this.store.rate,
            quality: this.store.quality,
            speed: this.store.speed,
            guarantee: this.store.guarantee,
            pstrv: this.store.pstrv,
            dispatch: this.store.dispatch,
            fensi: this.store.fensi,


          };

          let result = await this.$u.api.store.storeadd(data);

          if (result.code) {
            this.$refs.notice.show({
              type: "success",
              message: result.msg,
              duration: 2500,
              complete: () => {
                uni.$u.route({
                  type: "reLaunch",
                  url: "/pagesC/store/index",
                });
              },
            });
          } else {
            this.$refs.notice.show({
              type: "error",
              message: result.msg,
              duration: 2000,
            });
          }
        }).catch(() => {
          uni.$u.toast("效验失败");
        });
    },

    async del(e) {
      let data = {
        adminid: this.auth.id,
        stoid: this.stoid,
        url: e.file.url,
      };

      var result = await this.$u.api.product.delstoreimage(data);

      if (result.code) {
        this.$refs.notice.show({
          type: "success",
          message: result.msg,
          duration: 1000,
          complete: () => {
            // 图片还剩余一张的时候清空

            this.filelist = [];
            this.store.thumb_text = ""

          },
        });
      } else {
        this.$refs.notice.show({
          type: "error",
          message: result.msg,
          duration: 1000,
        });
      }
    },
  },
};
</script>

<style>
.content {
  padding: 20px;
}

.container {
  height: 100%;
  margin: 0 50rpx;
  box-sizing: border-box;
}

.avatar {
  text-align: center;
}

.u-avatar {
  margin: 80rpx auto 40rpx;
}

.xcx {
  width: 200rpx;
  height: 200rpx;
  margin: 80rpx auto 40rpx;
  border-radius: 100%;
  overflow: hidden;
}

.nickname {
  font-size: 14px;
  text-align: center;
}

.title {
  text-align: center;
  margin: 40rpx 0;
  font-size: 14rpx;
}

.avatar .u-upload {
  justify-content: center;
  align-items: center;
  margin: 3em auto;
}

.vedio .u-upload {
  justify-content: center;
  align-items: center;
  margin: 0.3em auto;
}

.vedio {
  text-align: center;
}

.u-vedio {
  margin: 80rpx auto 40rpx;
}
</style>